<template lang="html">
  <div class="advice-container">
    <el-table v-loading="loading" :border="true" :data="list">
      <el-table-column label="查看内容" type="expand" width="80">
        <template slot-scope="{row}">
          <el-form>
            <el-form-item label="意见内容">
              <span>{{ row.opinion }}</span>
            </el-form-item>
          </el-form>
        </template>
      </el-table-column>
      <el-table-column label="名字" prop="name" />
      <el-table-column label="电话" prop="phone" />
      <el-table-column label="意见简介">
        <template slot-scope="{row}">
          <span>{{ row.opinion.slice(0,20) }}</span>
        </template>
      </el-table-column>
    </el-table>
  </div>
</template>

<script>
import { getAdvice } from '@/api/wuye'
export default {
  data() {
    return {
      list: [],
      loading: false
    }
  },
  created() {
    this.fetchAdvice()
  },
  methods: {
    async fetchAdvice() {
      this.loading = true
      const { data = [] } = await getAdvice()
      this.list = data
      this.loading = false
    }
  }
}
</script>

<style lang="scss">
.advice-container {
  padding: 30px;
}
</style>
